{% extends "transsys/base_transsys.html" %}
{%block center%}
<div>
<h2>Add new gene</h2>
<form action="add" method="post">
{% csrf_token %} 
<label>Name:</label><input type="text" name="name"><br/>
<label>Product:</label>
<select name="product">
{% for f in ts_program.0.factor_list %}
<option value="{{f.name}}">{{f.name}}</option>
{% endfor %}
</select><br/>
<label>Promoters:</label>
<button style="align:right" type="button" onclick="addRow('promoterTable')">Add more</button>
<button style="align:right" type="button" onclick="delRow('promoterTable')">Delete</button>
<table id="promoterTable" border=1>
    <tr>
        <td>
            <input type="checkbox" name="checkbox" checked="checked"/>
        </td>
        <td>
            <label>Type: </label>
            <select name="type" onchange="updateRow('promoterTable', 0);">
            <option value="undefined">select</option>
            <option value="constitutive">constitutive</option>
            <option value="activate">activate</option>
            <option value="repress">rsepress</option>
            </select>
        </td>
        <td class="hidden">
            <label>Expression</label>
            <input type="text" name="expr" size="10" />
            <input type="hidden" name="expr" value="undefined" disabled />
        </td>
        <td class="hidden">
            <label>Factor</label>   
            <select name="factors">
                {% for f in ts_program.0.factor_list %}
                    <option value="{{f.name}}">{{f.name}}</option>
                {% endfor %}
            </select>
            <input type="hidden" name="factors" value="undefined" />
        </td>
        <td class="hidden">
            <label>Expression 1</label>
            <input type="text" name="expr1" size="10">
            <input type="hidden" name="expr1" value="undefined" />
        </td>
        <td class="hidden">
            <label>Expression 2</label> 
            <input type="text" name="expr2" size="10">
            <input type="hidden" name="expr2" value="undefined" />
        </td>
    </tr>
</table>
<input type="submit" name="submit" value="Submit"/>
</form>

</div>
{% endblock %}